<template>
  <div>
    <h2>子组件</h2>
    <p>接收到的父组件数据: {{ parentData }}</p>
    <input v-model="parentData" type="text" placeholder="编辑数据" />
    <button @click="sendDataToParent">发送数据到父组件</button>
  </div>
</template>

<script setup>
import { ref, watch } from "vue";

const props = defineProps({
  modelValue: String,
});

const emit = defineEmits(["update:modelValue"]);

const parentData = ref(props.modelValue);

// function sendDataToParent() {
//   emit("update:modelValue", parentData.value);
// }
// 监听数据变化，确保实时更新父组件
watch(parentData, (newValue) => {
  emit("update:modelValue", newValue);
});
</script>
